<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>
<script type="text/javascript">
function bjChange(value){
	$.post('selfGrade/getstu',{bjId:value},function(data){
			$('#stu').html(data);
		},'html');
}

function cx(){
	var stuId=$('#stu').val();
	$('#table').load('selfGrade/table',{stuId:stuId});
}

function cjChange(id,value){
	$.post('selfGrade/cjChange',{id:id,grade:value},function(data){});
}
</script>
<style type="text/css">
	.button1 {
 -webkit-transition-duration: 0.4s;
 transition-duration: 0.4s;
 padding: 13px 28px;
 text-align: center;
 background-color: white;
 color: black;
background: #ee0979; 
background: linear-gradient(to right, #ee0979, #ff6a00);
 border-radius:4px;
 }
 .button1:hover {
 background-color: #4CAF50;
 color: white;
 }
</style>
<body>
	<div>
		<p align="center">
			<label>班级：</label>
			<select id="bj" onchange="bjChange(this.value)">
				<option value="0">----请选择----</option>
				<c:forEach items="${list}" var="bj">
					<option value="${bj.id }">${bj.name}</option>
				</c:forEach>				
			</select>
			<label>学生：</label>
			<select id="stu">
				<option value="0">-----请选择-----</option>
			</select>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
			<button onclick="cx()" class="button1">查询</button>
		</p>
	</div>
	<div id="table"></div>
